
<script setup lang="ts">
import { ref } from 'vue'
import {useRouter, RouterView } from 'vue-router';
import svgIcon from '@/components/base-svgIcon/index.vue'
const iconListkey = ref(0)
const  comId = ref('chat')
const router = useRouter()
// const route = useRoute()
const iconList = [
    { id:0, name: '消息',  icon: 'icon-xiaoxi1',path: '/chat1', },
    { id:1, name: '联系人',  icon: 'icon-tianxuangouren',path: '/chat2', },
    // { name: '更多', icon: '#icon-gengduo' },
    { id:2, name: '收藏',  icon: 'icon-shoucang1',path: '/chat3', },
    { id:3, name: '文件',  icon: 'icon-wenjian' },
    { id:4, name: '朋友圈',  icon: 'icon-pengyouquan' },
    { id:5, name: '视频号',  icon: 'icon-wechat-video' },
    { id:6, name: '搜一搜',  icon: 'icon-souyisou' },
]
// const iconList1 = [
//     { name: '消息', icon: '#icon-xiaoxi' },
//     { name: '联系人', icon: '#icon-tianxuangouren' },
//     { name: '收藏', icon: '#icon-shoucang1' },
//     { name: '文件', icon: '#icon-wenjian' },
//     { name: '更多', icon: '#icon-gengduo' },
// ]
const iconBotmList = [
    { name: '小程序', icon: '#icon-xiaochengxu' },
    { name: '手机', icon: '#icon-shouji' },
    { name: '设置', icon: '#icon-liangduanduiqi' },
]


function handerClick  (val:any,index:any){
    console.log(val,index);
    iconListkey.value = index   
    if (val.name == '文件') {
            electron.ipcRenderer.send('openCollectionChat',)  
        }else{
        router.push({path:val.path})
    }
}

</script>

<template>
    <div class="lay dreg">
        <div class="lay_left">
            <img src="../../assets/images/default1.png" alt="" class="imgbox" style=""/>
            <div class="iconBox" style="height: 100%;">
                <template v-for="(i, k) in iconList" :key="k">
                    <span class="iconfont" :class="i.icon" style="display: inline-block; font-size: 25px; color: #515151;"  :title="i.name" :style="{color:k<3 && k==iconListkey ?'#5cb858':'#000'}"  @click="handerClick(i,k)"></span>
                </template>
            </div>
            <div class="iconBox" style="position: absolute;bottom: 0;left: 0;right: 0;">
                <svgIcon :icon-name="i.icon" size="subSmall" :color="'#eee'" :title="i.name" v-for="(i, k) in iconBotmList" :key="k"
                    style="margin-bottom: 20px" @click="handerClick(i,k)">
                </svgIcon>
            </div>
        </div>

        <div class="lay_center">
            <!-- <component :is="comId"></component> -->
            <router-view></router-view>
        </div>
    </div>
</template>

<style src="./index.scss" scoped></style>
